<template>
	<view>
		<customTabBar />
		<view class="my-box-personal" v-if="identity == 1">
			<navigator class="head-navigator" hover-class="hoverClass1" url="/pages/recruit/information/index">
				<view class="head" hover-class="hoverClass1">
					<view class="text txtHidden">{{user.name}}</view>
					<image class="pull-right" :src="user.portrait ? user.portrait : '/static/images/head.png'" binderror="onImageError"></image>
				</view>
			</navigator>
			<view class="editList-box">
				<navigator class="editList-navigator" url="/pages/recruit/my-resume/index" hover-class="hoverClass2">
					<view class="edit-item">
						<text class="iconfontPT iconzaixianjianli"></text>
						我的在线简历
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</navigator>
				<navigator class="editList-navigator" url="/pages/recruit/position-to-top/index" hover-class="hoverClass2">
					<view class="edit-item">
						<text class="iconfontPT iconzhidingjianli"></text>
						简历置顶
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</navigator>
				<navigator class="editList-navigator" url="/pages/recruit/identity-check/index" hover-class="hoverClass2">
					<view class="edit-item">
						<text class="iconfontPT iconshenfenhuhuan"></text>
						切换身份
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</navigator>
			</view>
		</view>
		<view class="my-box-company" v-else>
			<navigator url="/pages/recruit/company-info/index" hover-class="hoverClass1">
				<view class="head" hover-class="hoverClass1">
					<image class="pull-left" :src="user.portrait ? user.portrait : '/static/images/head.png'"></image>
					<view class="t1 txtHidden">{{user.name}}</view>
					<view class="t2">{{company.title}}<text class="line">·</text>{{user.post}}</view>
				</view>
			</navigator>
			<view class="editList-box">
				<view @click="navigatorUrlFn" class="editList-navigator" hover-class="hoverClass2" data-url="/pages/recruit/add-position/index">
					<view class="edit-item">
						<text class="iconfontPT iconfabuzhiwei1"></text>
						发布职位
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</view>
				<view @click="navigatorUrlFn" class="editList-navigator" hover-class="hoverClass2" data-url="/pages/recruit/job-manage/index">
					<view class="edit-item">
						<text class="iconfontPT icongongwenbao1"></text>
						职位管理
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</view>
				<navigator class="editList-navigator" v-if="user.company_id" hover-class="hoverClass2" :url="'/pages/recruit/company-auth/index?id='+user.company_id">
					<view class="edit-item">
						<text class="iconfontPT icongongsirenzheng1"></text>
						公司认证
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</navigator>
				<navigator class="editList-navigator" hover-class="hoverClass2" :url="user.company_id ? '/pages/recruit/company-dtl/index?id='+user.company_id : '/pages/recruit/company-manage/index'">
					<view class="edit-item">
						<text class="iconfontPT icongongsiguanli1"></text>
						公司管理
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</navigator>
				<navigator class="editList-navigator" hover-class="hoverClass2" url="/pages/recruit/identity-check/index">
					<view class="edit-item">
						<text class="iconfontPT iconshenfenhuhuan"></text>
						身份切换
						<text class="iconfontPT iconZp-toright pull-right"></text>
					</view>
				</navigator>
			</view>
		</view>
		<view class="bg" v-if="showModel" @click="hiddenFn"></view>
		<view class="showModelBox" v-if="showModel">
			<image src="https://fdfs.unifgroup.com:8888/group1/M00/02/60/ClEhn16O7ROAZI2uAABBrqLmugI313.png" class="iconImg"></image>
			<view class="txt">{{company.state == 3 ? '请等待企业资质信息审核通过' : '完善企业信息才能发布职位哦'}}</view>
			<navigator v-if="!user.company_id" class="btn-box" hover-class="hoverClass2" url="/pages/recruit/company-manage/index">去完善</navigator>
			<navigator v-else="company.state != 1 && company.state != 3" class="btn-box" hover-class="hoverClass2" :url="'/pages/recruit/company-auth/index?id='+user.company_id">去完善</navigator>
		</view>
	</view>
</template>

<script>
	import {
		mapGetters
	} from "vuex"
	import {
		getCompanyDtlInfo,
		getUserDtlInfo
	} from '../../../apis/recruit/index.js'
	import customTabBar from '../../components/recruit/custom-tab-bar.vue'

	export default {
		data() {
			return {
				showModel: false,
				user: {
					portrait: '',
					post: "—",
					email: "",
					phone: "",
					name: "—",
					company_id: ''
				},
				company: {
					title: "—",
					address: "—"
				}
			}
		},
		computed: {
			...mapGetters(["identity"])
		},
		onHide() {
			this.showModel = false
		},
		onShow() {
			this.$store.dispatch("recruit/setCurrentTabbar", 3);

			this.identity == 2 ? this.getThisCompanyUserInfo() : this.getThisPersonalUserInfo()
		},
		components: {
			customTabBar
		},
		methods: {
			getThisCompanyUserInfo() {

				let _this = this;
				getCompanyDtlInfo().then(res => {
					if (res.code == 1) {
						_this.user = res.data.member
						_this.company = res.data.company
					}
				})
			},
			//获取个人的信息
			getThisPersonalUserInfo() {
				let _this = this;
				getUserDtlInfo().then(res => {
					if (res.code == 1) {
						_this.user = res.data
					}
				})
			},
			navigatorUrlFn(e) {
				let _this = this;
				if (_this.company.state == 1) {
					uni.navigateTo({
						url: e.currentTarget.dataset.url,
					})
				} else {
					_this.showModel = true
				}
			},
			hiddenFn() {
				this.showModel = false
			},
			onImageError(e) {
				this.user.portrait = '../../images/head.png'
			}
		}
	}
</script>

<style lang="less">
	/* 个人模块样式 */

	.my-box-personal {
		.head {
			background: #E41805;
			color: #fff;
			height: 106rpx;
			line-height: 106rpx;
			padding: 20rpx 30rpx;

			image {
				width: 106rpx;
				height: 106rpx;
				display: inline-block;
				border-radius: 50%;
			}

			.text {
				font-size: 48rpx;
				display: inline-block;
				width: 80%;
			}
		}
	}

	.editList-box {
		padding: 20rpx 0;
		color: #333
	}

	.editList-navigator {
		padding: 0 30rpx;
	}

	.edit-item {
		height: 120rpx;
		line-height: 120rpx;
		font-size: 30rpx;
		text-indent: 72rpx;
		position: relative;
		box-shadow: 0 1rpx 0.5rpx -1rpx #CCCCCC;
	}

	.edit-item {
		.iconfontPT {
			width: 46rpx;
			height: 46rpx;
			border-radius: 50%;
			overflow: hidden;
			display: inline-block;
			position: absolute;
			left: 0;
			top: 37rpx;
			line-height: 46rpx;
			color: #fff;
			text-align: center;
			text-indent: 0;
			font-size: 24rpx;
		}
	}

	/* 公司模块样式 */


	.my-box-company {
		.head {
			background: #E41805;
			color: #fff;
			height: 106rpx;
			padding: 20rpx 30rpx 30rpx;

			image {
				width: 100rpx;
				height: 100rpx;
				display: inline-block;
				border-radius: 50%;
				margin-right: 24rpx;
			}
		}

		.t1 {
			font-size: 48rpx;
			font-weight: bold;
		}

		.t2 {
			font-size: 30rpx;
		}
	}


	.line {
		display: inline-block;
		padding: 0 15rpx;
	}

	.iconfabuzhiwei1 {
		background: linear-gradient(135deg, rgba(255, 176, 21, 1) 0%, rgba(255, 235, 150, 1) 100%);
		text-indent: -6rpx !important;
	}

	.icongongwenbao1,
	.iconzaixianjianli {
		background: linear-gradient(135deg, rgba(255, 100, 87, 1) 0%, rgba(253, 158, 93, 1) 100%);
	}

	.icongongsirenzheng1,
	.iconshenfenhuhuan {
		background: linear-gradient(135deg, rgba(139, 138, 253, 1) 0%, rgba(187, 185, 251, 1) 100%);
	}

	.icongongsiguanli1,
	.iconZp-yitoujianli {
		background: linear-gradient(135deg, rgba(60, 95, 248, 1) 0%, rgba(22, 188, 255, 1) 100%);
	}

	.iconzhidingjianli {
		background: linear-gradient(135deg, rgba(255, 100, 87, 1) 0%, rgba(253, 158, 93, 1) 100%);
	}

	/* .iconshenfenhuhuan{background: linear-gradient(135deg,rgba(255,176,21,1) 0%,rgba(255,235,150,1) 100%);} */


	.bg {
		width: 100vw;
		height: 100vh;
		background: rgba(0, 0, 0, 0.4);
		position: fixed;
		left: 0;
		top: 0;
	}

	.showModelBox {
		width: 568rpx;
		height: 424rpx;
		background: #fff;
		z-index: 5;
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		border-radius: 20rpx;
	}

	.iconImg {
		width: 250rpx;
		height: 250rpx;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		top: -125rpx;
	}

	.btn-box {
		background: linear-gradient(90deg, rgba(255, 169, 122, 1) 0%, rgba(255, 111, 31, 1) 100%);
		border-radius: 10rpx;
		width: 310rpx;
		height: 60rpx;
		line-height: 60rpx;
		margin: 95rpx auto 0;
		font-size: 24rpx;
		color: #fff;
		text-align: center;
	}

	.txt {
		font-size: 24rpx;
		color: #666;
		text-align: center;
		margin-top: 199rpx;
		line-height: 26rpx;
	}

	.hoverClass1 {
		color: #F8F8FF !important;
	}
</style>
